<template>
  <div>
    <h2>欢迎光临_阿卡丽的黑金商店</h2>
    <h3>皮肤 99 $ /个 ,折扣 &lt; 1折 &gt; </h3>
    <p>
      请输入你要购买的斤数: <input type="text" v-model.number="money">
    </p>
    <p><button @click="btn">结账买单</button></p>
    <p>结账单: 总价: {{all}}$元 折后价: {{zhehou}}$元 省了: {{jieyue}}$元</p>
  </div>
</template>

<script>
export default {
  data () {
    return {
      money:'',
      all:'',
      zhehou:'',
      jieyue:''
    }
  },
  methods: {
    btn(){
      this.all=this.money*99;
      this.zhehou=(this.all*0.1).toFixed(2);
      this.jieyue=(this.all*0.9).toFixed(2);
    }
  }
}
</script>

<style>
h2 {
  text-align: center;
  font-weight: normal;
}
h3 {
  text-align: center;
  /* font-weight: bold; */
}
p{
  text-align: center;
}
</style>